<template>
    <svg class="icon" aria-hidden="true">
        <use :xlink:href="'#icon-'+name"></use>
    </svg>


</template>

<script lang="ts" setup>
import { onBeforeMount } from 'vue'
defineProps(['name'])

onBeforeMount(() => {
    let iconSvg = document.querySelector('#icon_font_svg')
    if (!iconSvg) {
        iconSvg = document.createElement('div')
        iconSvg.setAttribute('id', 'icon_font_svg')
        iconSvg.setAttribute('style', 'width:0;height:0;position:absolute;display:none;')
        document.body.appendChild(iconSvg)
        iconSvg.innerHTML = `<svg>
    <symbol id="icon-clear-fill" viewBox="0 0 1024 1024">
        <path d="M810.666667 273.066667 750.933333 213.333333 512 452.266667 273.066667 213.333333 213.333333 273.066667 452.266667 512 213.333333 750.933333 273.066667 810.666667 512 571.733333 750.933333 810.666667 810.666667 750.933333 571.733333 512Z"></path>
    </symbol>
    <symbol id="icon-circle" viewBox="0 0 1024 1024">
        <path d="M896 602.208 896 424.96c39.328-37.888 63.968-90.944 63.968-149.728 0-114.688-93.312-208-208-208-57.216 0-109.088 23.232-146.752 60.736l-183.424 0c-37.888-39.328-90.912-63.936-149.696-63.936-114.688 0-208 93.312-208 208 0 58.752 24.608 111.808 63.904 149.664l0 180.576c-39.328 37.888-63.904 90.912-63.904 149.664 0 114.688 93.312 208 208 208 58.752 0 111.808-24.64 149.696-63.936l180.512 0c37.888 39.328 90.912 63.936 149.696 63.936 114.688 0 208-93.312 208-208C959.968 693.152 935.328 640.096 896 602.208zM751.968 131.264c79.392 0 144 64.608 144 144s-64.608 144-144 144-144-64.608-144-144S672.576 131.264 751.968 131.264zM272.096 128.064c79.392 0 144 64.608 144 144s-64.608 144-144 144-144-64.608-144-144S192.672 128.064 272.096 128.064zM272.096 895.936c-79.392 0-144-64.608-144-144s64.608-144 144-144 144 64.608 144 144S351.488 895.936 272.096 895.936zM464.032 832c10.304-24.672 16.064-51.68 16.064-80.064 0-114.688-93.312-208-208-208-28.384 0-55.424 5.76-80.096 16.096L192 464c24.672 10.336 51.712 16.064 80.096 16.064 114.688 0 208-93.312 208-208 0-28.352-5.76-55.392-16.064-80.064l97.44 0c-11.2 25.504-17.504 53.632-17.504 83.264 0 114.688 93.312 208 208 208 28.352 0 55.36-5.76 80.032-16.064l0 92.8c-24.672-10.304-51.68-16.064-80.032-16.064-114.688 0-208 93.312-208 208 0 28.384 5.76 55.392 16.064 80.064L464.032 832zM751.968 895.936c-79.392 0-144-64.608-144-144s64.608-144 144-144 144 64.608 144 144S831.36 895.936 751.968 895.936z"></path>
    </symbol>
    <symbol id="icon-date" viewBox="0 0 1024 1024">
        <path d="M689.344 512l82.688 0 0 82.688-82.688 0L689.344 512zM505.344 512l82.688 0 0 82.688L505.344 594.688 505.344 512zM497.344 645.376l82.688 0 0 82.688L497.344 728.064 497.344 645.376zM313.344 645.376l82.688 0 0 82.688L313.344 728.064 313.344 645.376z"></path>
        <path d="M152.128 243.2l716.8 0 0 89.6-716.8 0 0-89.6Z"></path>
        <path d="M886.848 154.432l-107.52 0L779.328 64l-89.6 0 0 90.432-358.4 0L331.328 64l-89.6 0 0 90.432L135.68 154.432C96.064 154.432 64 186.56 64 226.112L64 888.32C64 927.872 96.064 960 135.68 960l751.168 0c39.552 0 71.68-32.128 71.68-71.68L958.528 226.112C958.592 186.56 926.464 154.432 886.848 154.432zM868.928 870.4l-716.8 0 0-448 716.8 0L868.928 870.4zM868.928 332.8l-716.8 0L152.128 243.2l716.8 0L868.928 332.8z"></path>
    </symbol>
    <symbol id="icon-qrcode" viewBox="0 0 1024 1024">
        <path d="M468 128H160c-17.7 0-32 14.3-32 32v308c0 4.4 3.6 8 8 8h332c4.4 0 8-3.6 8-8V136c0-4.4-3.6-8-8-8z m-56 284H192V192h220v220z"></path>
        <path d="M274 338h56c4.4 0 8-3.6 8-8v-56c0-4.4-3.6-8-8-8h-56c-4.4 0-8 3.6-8 8v56c0 4.4 3.6 8 8 8zM468 548H136c-4.4 0-8 3.6-8 8v308c0 17.7 14.3 32 32 32h308c4.4 0 8-3.6 8-8V556c0-4.4-3.6-8-8-8z m-56 284H192V612h220v220z"></path>
        <path d="M274 758h56c4.4 0 8-3.6 8-8v-56c0-4.4-3.6-8-8-8h-56c-4.4 0-8 3.6-8 8v56c0 4.4 3.6 8 8 8zM864 128H556c-4.4 0-8 3.6-8 8v332c0 4.4 3.6 8 8 8h332c4.4 0 8-3.6 8-8V160c0-17.7-14.3-32-32-32z m-32 284H612V192h220v220z"></path>
        <path d="M694 338h56c4.4 0 8-3.6 8-8v-56c0-4.4-3.6-8-8-8h-56c-4.4 0-8 3.6-8 8v56c0 4.4 3.6 8 8 8zM888 548h-48c-4.4 0-8 3.6-8 8v134h-78V556c0-4.4-3.6-8-8-8H556c-4.4 0-8 3.6-8 8v332c0 4.4 3.6 8 8 8h48c4.4 0 8-3.6 8-8V644h78v102c0 4.4 3.6 8 8 8h190c4.4 0 8-3.6 8-8V556c0-4.4-3.6-8-8-8z"></path>
        <path d="M746 832h-48c-4.4 0-8 3.6-8 8v48c0 4.4 3.6 8 8 8h48c4.4 0 8-3.6 8-8v-48c0-4.4-3.6-8-8-8zM888 832h-48c-4.4 0-8 3.6-8 8v48c0 4.4 3.6 8 8 8h48c4.4 0 8-3.6 8-8v-48c0-4.4-3.6-8-8-8z"></path>
    </symbol>
    <symbol id="icon-cash" viewBox="0 0 1024 1024">
        <path d="M793.858 232.122L742.33 108.698c-17.243-45.917-46.087-54.183-80.238-42.204L256.98 232.122h536.878z"></path>
        <path d="M976.737 695.382H755.89c-45.157 0-81.763-36.607-81.763-81.764v-98.117c0-45.157 36.606-81.763 81.763-81.763h220.786V232.122c0-68.214-45.147-130.048-112.87-130.048l16.5 87.845c9.569 3.188 19.383 13.004 19.383 26.01l0.146 38.77c0 13.004-9.962 19.629-22.72 19.629H134.122c-12.76 0-19.139-3.19-19.139-19.63v-38.771c0-13.005 6.379-19.63 19.14-19.63h74.103l167.345-94.223h-199.49c-67.478 0-128.822 65.024-128.822 133.238v600.516c0 68.214 54.964 126.612 122.197 126.612h678.705c67.722 0 128.576-61.834 128.576-130.048v-129.4l-0.001-7.61z"></path>
        <path d="M800.047 480.834c-28.9 0-52.33 23.428-52.33 52.328v62.794c0 28.9 23.43 52.328 52.33 52.328H923.86c28.9 0 52.33-23.428 52.33-52.328v-62.794c0-28.9-23.43-52.328-52.33-52.328H800.047z m9.177 116.416c-18.053 0-32.689-14.636-32.689-32.69s14.636-32.69 32.689-32.69c18.055 0 32.69 14.636 32.69 32.69s-14.635 32.69-32.69 32.69z"></path>
    </symbol>
    <symbol id="icon-clear" viewBox="0 0 1024 1024">
        <path d="M512 967.0656c-251.392 0-455.0656-203.776-455.0656-455.0656S260.608 56.9344 512 56.9344s455.0656 203.776 455.0656 455.0656S763.392 967.0656 512 967.0656z m-0.3072-495.104L370.8928 331.1616c-11.0592-11.0592-29.0816-11.0592-40.2432 0-11.0592 11.0592-11.0592 29.0816 0 40.2432l140.8 140.8-140.8 140.8c-11.0592 11.0592-11.0592 29.0816 0 40.2432 11.0592 11.0592 29.0816 11.0592 40.2432 0l140.8-140.8L652.4928 693.248c11.0592 11.0592 29.0816 11.0592 40.2432 0s11.0592-29.0816 0-40.2432L551.8336 512.2048l140.8-140.8c11.0592-11.0592 11.0592-29.0816 0-40.2432-11.0592-11.0592-29.0816-11.0592-40.2432 0L511.6928 471.9616z"></path>
    </symbol>
    <symbol id="icon-vips" viewBox="0 0 1024 1024">
        <path d="M837.92 96a64 64 0 0 1 55.264 31.744l108.672 186.336a64 64 0 0 1-5.28 72.224l-409.6 512a96 96 0 0 1-149.952 0l-409.6-512a64 64 0 0 1-5.28-72.224l108.672-186.336A64 64 0 0 1 186.08 96h651.84z m-204.992 388.096l-107.904 151.104a16 16 0 0 1-26.048 0l-107.904-151.104a48 48 0 1 0-78.144 55.808l107.936 151.072a112 112 0 0 0 182.272 0l107.936-151.072a48 48 0 1 0-78.144-55.808z"></path>
    </symbol>
    <symbol id="icon-search" viewBox="0 0 1024 1024">
        <path d="M945.066667 898.133333l-189.866667-189.866666c55.466667-64 87.466667-149.333333 87.466667-241.066667 0-204.8-168.533333-373.333333-373.333334-373.333333S96 264.533333 96 469.333333 264.533333 842.666667 469.333333 842.666667c91.733333 0 174.933333-34.133333 241.066667-87.466667l189.866667 189.866667c6.4 6.4 14.933333 8.533333 23.466666 8.533333s17.066667-2.133333 23.466667-8.533333c8.533333-12.8 8.533333-34.133333-2.133333-46.933334zM469.333333 778.666667C298.666667 778.666667 160 640 160 469.333333S298.666667 160 469.333333 160 778.666667 298.666667 778.666667 469.333333 640 778.666667 469.333333 778.666667z"></path>
    </symbol>
    <symbol id="icon-eye" viewBox="0 0 1024 1024">
        <path d="M512 832c-213.888 0-384.512-106.688-512-320 129.408-213.312 300.032-320 512-320 211.968 0 382.592 106.688 512 320-127.488 213.312-298.112 320-512 320z m0-64a256 256 0 1 0 0-512 256 256 0 0 0 0 512z m0-128a128 128 0 1 0 0-256 128 128 0 0 0 0 256z"></path>
    </symbol>
    <symbol id="icon-eye-show" viewBox="0 0 1024 1024"><path d="M247.36 246.528L176.704 175.872l46.336-46.4 85.76 85.76C375.296 186.496 447.296 172.16 524.672 172.16c217.216 0 392.128 112.96 524.672 338.752-59.52 103.04-128.32 182.528-206.272 238.528l98.624 98.624-46.4 46.4-109.12-109.184a531.2 531.2 0 0 1-1.024 0.512l-126.272-126.208 0.832-0.768-70.016-69.952a99.968 99.968 0 0 1-0.768 0.64l-140.8-140.736 0.64-0.832-71.552-71.616a202.752 202.752 0 0 0-0.64 0.832L246.336 247.104l0.96-0.576z m451.584 358.848c14.4-28.16 22.464-60.288 22.464-94.4C721.408 398.72 633.344 307.84 524.672 307.84c-35.264 0-68.352 9.6-96.96 26.368l78.528 78.528c6.016-1.28 12.288-1.856 18.688-1.856 54.272 0 98.368 45.44 98.368 101.632 0 5.44-0.448 10.816-1.28 16l76.928 76.928zM191.296 284.8l150.656 150.72a208.64 208.64 0 0 0-14.08 75.52c0 112.256 88.128 203.264 196.8 203.264 28.16 0 54.848-6.08 79.04-17.024l117.888 117.824A551.04 551.04 0 0 1 524.672 849.792c-219.136 0-394.048-112.96-524.672-338.816C56.128 415.36 119.936 339.904 191.232 284.8z m329.216 329.216L426.816 520.32c3.776 51.008 43.904 91.52 93.696 93.696z"></path></symbol>
</svg>`
    }
})
</script>